/**
* Created by yyr on 2018/1/10
*已设立基金》详情页
*/
<template>
    <div>
        <div class="right">
            <csFundHead :fundData="fundData" @addRedDot="addRedDot"></csFundHead>
            <el-tabs type="border-card" class="ca-tabs ca-m-t-15" @tab-click="handleClick" :value="tabIndex">
                <el-tab-pane :label="tabArr[0]">
                    <csRedDot slot="label" :label="tabArr[0]" :showDot="dotStateList[0]"></csRedDot>
                    <div v-if="activeIndex == 0">
                        <!--基本信息-->
                        <csFundDetailsBasic @addRedDot="addRedDot"></csFundDetailsBasic>
                        <!--账户信息-->
                        <csFundAccount @addRedDot="addRedDot"></csFundAccount>
                    </div>
                </el-tab-pane>
                <!--合伙人-->
                <el-tab-pane :label="tabArr[1]" :disabled="!isAuthPartnerSee">
                    <csRedDot slot="label" :label="tabArr[1]" :showDot="dotStateList[1]"></csRedDot>
                    <div v-if="activeIndex == 1">
                        <csFundDetailsPartner @addRedDot="addRedDot"></csFundDetailsPartner>
                    </div>
                </el-tab-pane>
                <!--基金支出-->
                <el-tab-pane :label="tabArr[2]" :disabled="!isAuthExpendSee">
                    <csRedDot slot="label" :label="tabArr[2]" :showDot="dotStateList[2]"></csRedDot>
                    <div v-if="activeIndex == 2">
                        <csFundExpenditure @addRedDot="addRedDot"></csFundExpenditure>
                    </div>
                </el-tab-pane>
                <!--基金分配-->
                <el-tab-pane :label="tabArr[3]" :disabled="!isAuthDistributionSee">
                    <csRedDot slot="label" :label="tabArr[3]" :showDot="dotStateList[3]"></csRedDot>
                    <div v-if="activeIndex == 3">
                        <csFundDetailsDistribution @addRedDot="addRedDot"></csFundDetailsDistribution>
                    </div>
                </el-tab-pane>
                <!--闲散理财-->
                <el-tab-pane :label="tabArr[4]" :disabled="!isAuthIdleSee">
                    <csRedDot slot="label" :label="tabArr[4]" :showDot="dotStateList[4]"></csRedDot>
                    <div v-if="activeIndex == 4">
                        <csFundIdleFinancing @addRedDot="addRedDot"></csFundIdleFinancing>
                    </div>
                </el-tab-pane>
                <el-tab-pane :label="tabArr[5]" :disabled="!isAuthInvestedSee">
                    <!--投资数据-->
                    <csRedDot slot="label" :label="tabArr[5]" :showDot="dotStateList[5]"></csRedDot>
                    <div v-if="activeIndex == 5">
                        <csFundDetailsInvestment></csFundDetailsInvestment>
                    </div>
                </el-tab-pane>
                <el-tab-pane :label="tabArr[6]" :disabled="!isAuthFileSee">
                    <!--文件管理-->
                    <csRedDot slot="label" :label="tabArr[6]" :showDot="dotStateList[6]"></csRedDot>
                    <div v-if="activeIndex == 6">
                        <csFundFileDetail
                            title="基金档案"
                            :businessId="fundId"
                            :fileType="fileType"
                            :addAuth="authText"
                            @addDot="addRedDot(6)"
                        ></csFundFileDetail>
                        <ceFundMeeting @addRedDot="addRedDot"></ceFundMeeting>
                    </div>
                </el-tab-pane>
            </el-tabs>
        </div>
    </div>
</template>

<script type="text/ecmascript-6">
    import {api} from './api';
    import {STATUS_HTTP_SUCCESS, apiHttp} from '__service/csHttp';
    import {addRemind, isNoAuth, getDetailRemind, read} from '__service/utils';
    export default {
        data() {
            return {
                isAuthPartnerSee: isNoAuth('已设立基金-基金合伙人-查看'),
                isAuthExpendSee: isNoAuth('已设立基金-基金支出-查看'),
                isAuthDistributionSee: isNoAuth('已设立基金-基金分配-查看'),
                isAuthIdleSee: isNoAuth('已设立基金-闲散理财-查看'),
                isAuthInvestedSee: isNoAuth('已设立基金-投资数据-查看'),
                isAuthFileSee: isNoAuth('已设立基金-文件管理-查看'),
                authText: '已设立基金-文件管理-编辑',
                fundId: this.$route.params.fundId,
                tabIndex: this.$route.params.tabIndex.toString(),
                fundData: {},//响应数据
                tabArr: ['基金详情', '合伙人', '基金支出', '基金分配', '闲散理财', '投资数据', '文件管理'],
                fileType: '',
                dotStateList: [false, false, false, false, false, false, false], // 小红点状态
                activeIndex: 0,
            }
        },
        watch: {
        },
        props: {},
        created() {
           this.getDetail(this.fundId);
        },
        mounted() {
            let ind = {
                index: this.$route.params.tabIndex.toString()
            }
            this.handleClick(ind)
            // 获取红点
            this.getDotList();
            // 为子组件创建的第三方组件方法
            this.$root.Dot.$on('getDotList', () => {
                this.getDotList();
            })
            let fileTypeList = this.$store.state.user.fileFloderDicVoList;
            fileTypeList.map(item=>{
                if (item.name === '基金档案') {
                    this.fileType = item.type;
                }
            })
        },
        methods: {
            getDetail(id) {
                apiHttp(api.DETAIL_FUND,{id: id}).then( ret=>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.fundData = ret.data;
                    }
                })
            },
            changeHead(val) {
                this.isHeadEdit = val;
            },
            changePartner(val) {
                this.isPartnerEdit = val;
            },
            changeIdle(val) {
                this.isFundIdleFinancingEdit = val;
            },
            // 设置小红点状态
            async getDotList() {
                const dotList = await getDetailRemind({ dataId: this.$route.params.fundId, dataType: 5 });
                dotList.map(x => {
                    this.dotStateList[x.dataTab] = true;
                });
                this.dotStateList = this.dotStateList.concat([]);
            },
            // 切换tab
            handleClick(val) {
                this.activeIndex = val.index;
                //去除小红点
                read({ dataId: this.$route.params.fundId, dataTab: val.index, dataType: 5 });
                this.dotStateList[val.index] = false;
                this.dotStateList = this.dotStateList.concat([]);
                // 设置小红点状态 end
            },
            async addRedDot(index) {
                // 添加小红点
                await addRemind({
                    dataId: this.$route.params.fundId, // 业务id
                    dataTab: index, // tab页顺序 head 也为0 新建为'-1'
                    dataType: 5, // 1拟投资项目,2已投资项目,3母基金,4拟设立基金,5已设立基金,6客户,7潜在项目
                });
                // 根据第三方组件来调用 父组件中定义的方法 重新获取小红点
                this.$root.Dot.$emit('getDotList');
                // 添加小红点 end
            },
        },
        beforeDestroy() {
            // 销毁小红点第三方vue
            this.$root.Dot.$off('getDotList');
        },
        components: {
            'csFundHead': require('./header/index.vue'),//头部index页
            'csFundDetailsBasic': require('./basic/index.vue'), //选项卡基本信息index页
            'csFundAccount': require('./account/index'), //选项卡基本信息》账户信息 index
            'csFundDetailsPartner': require('./partner/index.vue'), //选项卡基本信息》合伙人信息 index
            'csFundExpenditure': require('./fund-expenditure/index.vue'),//选项卡基本信息》基金支出 index
            'csFundDetailsInvestment': require('./investment/index.vue'),//选项卡基金信息》投资数据 index
            'csFundDetailsDistribution': require('./fund-distribution/index.vue'),//选项卡基金信息》基金分配 index
            'csFundIdleFinancing': require('./idle-financing/index.vue'),//选项卡基金信息》闲散理财 index
            'csFundFileDetail': require('__components/file-list/index'),//选项卡基金信息》文件管理
            'ceFundMeeting': require('./fund-meeting//index.vue'),//选项卡》基金会议
            'csRedDot': require('__components/red-dot'), // 小红点
        },
    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>

</style>
